<!DOCTYPE html>
<html lang='en'>

<head>
    <meta charset='UTF-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <title>Document</title>
    <script type='text/javascript' src='../lib/echarts.min.js'></script>
    <script type='text/javascript' src='../lib/jquery-3.4.1/jquery-3.4.1.min.js'></script>


</head>

<body>
    <div id='main' style='width: 700px; height:400px'></div>

    <script>
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));



        $.ajax({
            'url': 'http://localhost:8080/stay/stayBar',
            'data': {},
            'success': function (result) {
                var floorList=[];
                var floorCount=[];

                var arr = result.data.stayBar;
                for(var i=0;i<arr.length;i++){
                    floorList.push(arr[i].floor);
                    floorCount.push(arr[i].count)
                }    

                // 指定图表的配置项和数据
                var option = {
                    title: {
                        text: '订单楼层'
                    },
                    tooltip: {},
                    legend: {
                        data: ['订单楼层']
                    },
                    xAxis: {
                        data:floorList,
                        axisLabel:{
                           interval:0,
                           rotate:30     
                        }
                    },
                    yAxis: {},
                    series: [
                        {
                            name: '订单楼层',
                            type: 'bar',
                            data:floorCount
                        }
                    ]
                };

                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);


            }
        })





    </script>
</body>

</html>